@keyframes slideInRight {
  from {
    transform: translate3d(100px, 0, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.@{halo}animate-slideinright {
  animation: slideInRight ease 0.3s both;
}

@keyframes slideUp {
  from {
    transform: translate3d(0, 100%, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.@{halo}animate-slide-up {
  animation: slideUp ease 0.3s both;
}

@keyframes slideDown {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(0, 100%, 0);
  }
}

.@{halo}animate-slide-down {
  animation: slideDown ease 0.3s both;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.@{halo}animate-fade-in {
  animation: fadeIn ease 0.3s both;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.@{halo}animate-fade-out {
  animation: fadeOut ease 0.3s both;
}
